<template>
	<div class="easyd-weixin-Box">

		<div class="app_page_box">
			<div class="app_page">

				<div class="content_area app_box_content_list app_list_box">
					<div class="T1">
						{{salesDetailData.sk_title}}
					</div>
					<div class="MARGIN_BOTTOM_10">
						<span class="C4">作者：</span>
						<span class="C1">{{salesDetailData.sk_author}}</span>
					</div>
					<div class="add_box" v-for="(item,index) in salesDetailData.sk_new_content">
						<div class="add_img" v-if="item.type == '1'">
							<img :src="item.txt" />
						</div>
						<div class="add_txt" v-else-if="item.type == '0'" v-html="item.txt">
							<!--{{item.txt}}-->
						</div>
						<div class="add_video" v-else-if="item.type == '3'">
							<video width="" height="">
								<source src="myvideo.mp4" type="video/mp4"></source>
								<source src="myvideo.ogv" type="video/ogg"></source>
								<source src="myvideo.webm" type="video/webm"></source>
								<object width="" height="" type="application/x-shockwave-flash" data="myvideo.swf">
									<param name="movie" value="myvideo.swf" />
									<param name="flashvars" value="autostart=true&amp;file=myvideo.swf" />
								</object> 当前浏览器不支持 video直接播放，点击这里下载视频：
								<a href="myvideo.webm">下载视频</a>
							</video>
						</div>
					</div>

					<div class="app_box_flex">
						<div class="app_box_content_left">
							<span class="C4 T4">更新时间：{{$common.getTimes(salesDetailData.sk_create_time,'cn')}}</span>
						</div>
					</div>
				</div>

			</div>
		</div>

	</div>
</template>

<script>
	import { mapState, mapMutations } from "vuex";
	export default {

		data() {
			return {
				feedbackTypeArr: ['行业知识', '产品知识',  '销售技巧'], //反馈类型
			};
		},
		computed: {
			...mapState({
                salesDetailData: state => state.SalesEssentialModule.salesDetail,
			})
		},
		mounted() {
			this.initData();
		},
		methods: {

			//  ...mapMutations(["ShopIndexModule/updateIsShopGuide"]),
			
            initData(type) {
            	
                this.$easyUtil.startLoading(this);
                this.$http.getHttp(
                    this.$API.knowledgeBaseDetail + "/sk_id/"+this.$route.query.sk_id,
                    rs => {
                        this.$easyUtil.endLoading(this);
                        console.log(rs);
                        this.$store.commit("SalesEssentialModule/updateSalesDetailData", rs.knowledgeDetail[0]);
                        this.salesDetailData.sk_new_content = JSON.parse(this.salesDetailData.sk_content);
                        
                        
                    }
                );
            },

		}
	};
</script>

<style lang="stylus" scoped>
	@import '~PUBLIC_CSS';
	.content_area {
		padding: 10px;
	}
	
	.content_area .add_box {
		position: relative;
	}
	
	.content_area .add_box .add_img {
		/*height: 250px;*/
		margin-bottom: 10px;
		/*border: 1px dotted #FBD415;*/
		/*padding: 10px;*/
		position: relative;
	}
	
	.content_area .add_box .add_img img {
		width: 100%;
		/*height: 100%;*/
		object-fit: cover;
	}
	
	.content_area .add_box .add_img span {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		line-height: 250px;
		text-align: center;
	}
	
	.content_area .add_box .add_txt {
		margin-bottom: 10px;
		/*border: 1px dotted #FBD415;*/
		/*padding: 10px;*/
	}
	
	.content_area .add_box .add_txt textarea {
		width: 100%;
		border: 0;
	}
	
	.content_area .add_box .add_video {
		margin-bottom: 10px;
		border: 1px dotted #FBD415;
		padding: 10px;
	}
	
	.content_area .add_box .add_video video {
		width: 100%;
	}
	
	.content_area .add_box i {
		position: absolute;
		top: -10px;
		right: -10px;
		color: red;
		font-size: x-large;
	}
	
	.content_area .content_area_info {
		text-align: center;
		padding: 50px;
	}
	
	.content_area .content_area_info span {
		font-size: x-large;
		padding-right: 5px;
	}
	
	.content_area .content_area_btn {}
	
	.content_area .content_area_btn .app_box_flex_1 {
		text-align: center;
		background: #d6d6d6;
		padding: 10px 5px;
		margin-right: 5px;
	}
	
	.content_area .content_area_btn .app_box_flex_1:last-child {
		margin-right: 0px;
	}
	
	.content_area .content_area_btn .app_box_flex_1 span {
		font-size: x-large;
	}
	
	.content_area .content_area_btn .app_box_flex_1 p {
		line-height: initial;
	}
</style>